<template>
  <div>
  <el-menu
    :default-active="activeIndex"
    class="el-menu-demo"
    mode="horizontal"
    @select="handleSelect"
    background-color="gray"
    text-color="#fff"
    active-text-color="#ffd04b"
    :router="true"
    unique-opened
  >

<!--    <el-menu-item index="1" v-on:click="IndexLayout" style="margin-left: 200px">首页</el-menu-item>-->
<!--    <el-submenu index="2">-->
<!--      <template slot="title">男子专区</template>-->
<!--      <el-menu-item index="manSport">运动鞋</el-menu-item>-->
<!--      <el-menu-item index="manSkate">平板鞋</el-menu-item>-->
<!--      <el-menu-item index="manSlipper" >拖鞋</el-menu-item>-->
<!--    </el-submenu>-->


<!--    <el-submenu index="3">-->
<!--      <template slot="title">女子专区</template>-->

<!--      <el-menu-item index="womanHigh" >高跟鞋</el-menu-item>-->
<!--      <el-menu-item index="womanSport" >运动鞋</el-menu-item>-->
<!--      <el-menu-item index="womanSkate" >平板鞋</el-menu-item>-->
<!--      <el-menu-item index="womanSlipper">拖鞋</el-menu-item>-->
<!--    </el-submenu>-->


<!--    <el-menu-item index="4"  @click="showMsg" >-->
<!--      <template slot="title"   >儿童专区-->
<!--&lt;!&ndash;      <template slot="title" >&ndash;&gt;-->
<!--&lt;!&ndash;        <el-button @click="showMsg" style="border-color: #8c939d" type="info" plain>儿童专区</el-button>&ndash;&gt;-->
<!--&lt;!&ndash;        <a href="../TransferInterface.vue">儿童专区</a>&ndash;&gt;-->
<!--      </template>-->
<!--    </el-menu-item>-->
<!--    <el-menu-item index="5" @click="showMsg"  >-->
<!--      <template slot="title">老年专区-->
<!--&lt;!&ndash;      <template slot="title" >&ndash;&gt;-->
<!--&lt;!&ndash;        <el-button @click="showMsg" style="border-color: #8c939d" type="info" plain>老年专区</el-button>&ndash;&gt;-->
<!--      </template>-->
<!--    </el-menu-item>-->

  </el-menu>
  </div>

</template>

<script>
  export default {
    name: "GuideMenu",

    data() {
      return {
        activeIndex: '1',

      };
    },
    methods: {

      handleSelect(key, keyPath) {
        console.log(key, keyPath);
      },
      IndexLayout(){
        this.$router.push({path:"/"})
      },
      showMsg(){
        // alert("此功能还在开发中，敬请期待")
        this.$router.push({path: "/transferInterface"})
      },


    }

  }
</script>

<style scoped>

  .el-aside {
    transition: width 0.15s;
    -webkit-transition: width 0.15s;
    -moz-transition: width 0.15s;
    -webkit-transition: width 0.15s;
    -o-transition: width 0.15s;
  }

</style>
